/*头部内容*/

.bg {
	width: 100%;
	height: 8.57rem;
	background: url(../img/headerbg.png)no-repeat;
	background-size: 100% 100%;
	display: flex;
	flex-flow: column wrap;
	justify-content: flex-end;
}
/*.bg_text{
	width: 6.40rem;
	height: 2.07rem;
	position: absolute;
	top: .85rem;
	left: .6rem;
	opacity: 0;
	animation: fade linear 1s forwards 0.4s;
}
@keyframes fade{
	from{opacity: 0;}
	to{opacity: 1}
}*/
/*@keyframes move_left{
	from{left:100%;top:-100%;}
	to{left: .8rem;}
}
@keyframes move_right{
	from{right:100%;top:50%;}
	to{right: .89rem;}
}*/
/*.figure_left{
	width: 1.54rem;
	height: 1.25rem;
	position: absolute;
	left: .8rem;
	top: 5.08rem;
	opacity: 0;
	animation: fade linear 1s 0.8s forwards;
}
.figure_right{
	width: 1.97rem;
	height: 1.30rem;
	position: absolute;
	right: .89rem;
	top: 5.21rem;
	opacity: 0;
	animation: fade linear 1s 1.2s forwards;
}
.figure_bottom{
	width:2.32rem;
	height: 3.86rem;
	position: absolute;
	left: 50%;
	margin-left: -1.16rem;
	top: 3.5rem;
	opacity: 0;
	animation: fade linear 1s 1.4s forwards;
}*/
.container-box {
	width: 100%;
}

.sponsor {
	width: 7.16rem;
	margin: 0 auto;
	margin-bottom: .19rem;
	position: relative;
}

.sponsor-unit {
	position: absolute;
	left: 0;
	bottom: 0;
	font-size: .24rem;
	transform: scale(.75);
	transform-origin: 0 100%;
	white-space: nowrap;
}


/*.sponsor-unit{}*/

.sponsor-unit span {
	display: block;
	color: #646464;
}

.voting-rules {
	position: absolute;
	right: 0;
	bottom: 0;
	font-size: .32rem;
	color: #121111;
	transform: scale(.75);
	transform-origin: 100% 100%;
	white-space: nowrap;
}

.flower-border {
	width: 100%;
	height: 1.3rem;
	background: url(../img/flowerborder.png)no-repeat;
	background-size: 100% 100%;
}


/*投票规则*/

.layui-layer {
	background: none!important;
	box-shadow: 1px 1px 50px rgba(0, 0, 0, 0)!important;
}
.voting-rules-lay {
	display: none;
	margin: 0 auto;
	background: url(../img/votingrules.png)no-repeat;
	background-size: 100% 100%;
	width: 6.15rem;
	height: 11.03rem;
}

.close {
	position: absolute;
	top: 0;
	right: 0;
}

.voting-rules-lay-content {
	width: 5.20rem;
	margin: 0 auto;
	font-size: 0.24rem;
	align-content: center;
}

.voting-rules-title p {
	color: #84525c;
	padding-top: 1.4rem;
}

.voting-rules-innr {
	margin-top: .24rem;
	color: #4c4b4b;
}

.voting-rules-innr-title {
	color: #84525c;
}

.voting-rules-lay-content p,
.voting-rules-innr p {
	line-height: .42rem;
}

.voting-rules-foot {
	margin-top: .2rem;
}

.voting-rules-foot p {
	text-align: center;
	color: #4c4b4b;
	letter-spacing: .03rem;
	line-height: .37rem;
}

.qr-code {
	width: 1.58rem;
	height: 1.53rem;
	background: white;
	display: block;
	margin: 0 auto;
	margin-top: .3rem;
}

.close-pic {
	width: .63rem;
	height: .63rem;
	position: absolute;
	top: 0;
	right: 0;
}


/*选项卡*/

.home-tab {
	display: flex;
	width: 7.24rem;
	margin: 0 auto;
	justify-content: space-between;
	align-items: flex-end;
}

.home-tab li {
	width: 3.48rem;
	height: .65rem;
	margin-top: .57rem;
}

.home-tab li:first-child {
	background: url(../img/homebt02.png)no-repeat;
	background-size: 100% 100%;
}

.home-tab li:last-child {
	background: url(../img/rankingbt01.png)no-repeat;
	background-size: 100% 100%;
}

.home-tab li.active {
	width: 3.48rem;
	height: .65rem;
}

.home-tab li:first-child.active {
	background: url(../img/homebt01.png)no-repeat;
	background-size: 100% 100%;
}

.home-tab li:last-child.active {
	background: url(../img/rankingbt02.png)no-repeat;
	background-size: 100% 100%;
}


/*首页*/

.home-page-box {
	overflow: hidden;
	width: 100%;
	background: url(../img/content.png)repeat;
}

.home-page {
	position: relative;
	top: -0.42rem;
}

.rank-page {
	position: relative;
	top: -0.42rem;
}


/*搜索*/

.search {
	width: 100%;
	height: 4.27rem;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../img/search.png)no-repeat;
	background-size: 7.08rem;
}

.search-bt {
	width: 1.03rem;
	height: .59rem;
	position: absolute;
	top: 0;
	border-radius: 0 .30rem .30rem 0;
	opacity: 0;
	top: 1.9rem;
	right: .43rem;
	outline: none;
	border: none;
}

.search input {
	width: 3rem;
	margin-left: 2.48rem;
	margin-top: 2.02rem;
	font-size: .28rem;
	background: #eeeeed;
	outline: none;
	border: none;
	color: #3d2118;
}

.search input::-webkit-input-placeholder {
	color: #aca5a3;
	font-size: .28rem;
}


/*内容*/

.content {
	width: 6.26rem;
	margin: 0 auto;
	padding-top: 2.81rem;
	overflow: hidden;
}
.video-content:nth-child(3),.video-content:nth-child(2){
	margin-top: 0;}
.video-content {
	width: 2.98rem;
	height: 4.21rem;
	background-color: #d7d2d1;
	border-radius: .2rem;
	border: solid .01rem #382116;
	float: left;
	margin-top: .26rem;
}

.video-even {
	margin-right: .26rem;
}

.play-video {
	width: 2.72rem;
	height: 3.95rem;
	margin: .12rem auto;
	background-color: #e7e6e5;
	border-radius: .2rem;
	border: solid .01rem #382116;
	overflow: hidden;
	position: relative;
}

.user-number {
	position: absolute;
	font-size: .24rem;
	top: 0;
	width: 1.36rem;
	background: rgba(88,65,57,0.45);
	text-align: center;
	border-radius: 0 .16rem .16rem 0;
	padding: .02rem 0;
	color: #e7e6e5;
}
.video {
	height: 2.14rem;
	border-radius: .2rem .2rem 0 0;
	display: block;
}

.play {
	position: absolute;
	top: .71rem;
	left: 1.03rem;
	width: .72rem;
}

.team-name {
	width: 133%;
	text-align: center;
	transform: scale(.75);
	transform-origin: 0 0;
	overflow: hidden;
	/*align-items: center;
	justify-content: flex-start;
	position: relative;
	box-sizing: border-box;*/
}

.team-name div {
	font-size: .24rem;
	text-align: center;
	color: #604942;
	margin-top: .12rem;
}
.clear {
	clear: both;
}
/*排行*/

.ranking-content {
	width: 6.24rem;
	height: 1.33rem;
	margin-bottom: .1rem;
	background-color: #dddad9;
	border-radius: .1rem;
	border: solid .01rem #c4bdbb;
}

.ranking-content-box {
	width: 5.92rem;
	height: 1.33rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.ranking {
	width: .73rem;
	height: .39rem;
	background: url(../img/No2.png)no-repeat;
	background-size: 100%;
}

.ranking-top {
	background: url(../img/No1.png)no-repeat;
	background-size: 100%;
}

.ranking span {
	font-size: .24rem;
	color: #ffffff;
	text-align: center;
	display: block;
}

.ranking-number-box {
	height: 1.04rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	overflow: hidden;
}

.ranking-video {
	width: 1.67rem;
	height: 1.04rem;
	border-radius: .1rem;
}

.ranking-video-pic {
	width: 1.67rem;
	height: 1.04rem;
	border-radius: .1rem;
}

.ranking-name {
	margin-left: .12rem;
}

.ranking-name span {
	display: -webkit-box;
	white-space: nowrap;
	display: block;
	font-size: .24rem;
	text-align: center;
	line-height: .45rem;
	color: #543c37;
}

.ranking-votes {
	font-size: .28rem;
	color: #3d2118;
	font-weight: bold;
}


/*投票模块*/

.vote-content {
	width: 2.7rem;
	height: .70rem;
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.vote-bt,
.gift-bt {
	width: 50%;
	text-align: center;
}

.vote-box,
.gift-box {
	text-align: center;
	font-size: .24rem;
}

.vote-box span,
.gift-box span {
	display: block;
	transform: scale(.79);
	transform-origin: 50% 0;
	color: #543c37;
	text-align: center;
}

.vote,
.gift {
	display: block;
	margin: 0 auto;
	width: .44rem;
	height: .44rem;
	padding-top: .13rem;
}

.votes {
	width: 100%;
	height: .5rem;
	background: #604942;
}

.votes span {
	text-align: center;
	display: block;
	font-size: .32rem;
	color: #e7e6e5;
	line-height: .49rem;
	letter-spacing: .03rem;
}


/*底部*/

.bottom-picture {
	background: url(../img/bottom.png)no-repeat;
	background-size: 100% 100%;
	width: 2.1rem;
	height: 1.29rem;
	float: right;
}

.gift-package {
	width: .93rem;
	position: fixed;
	right: .32rem;
	bottom: .71rem;
	z-index: 999;
}


/*暂无数据*/

.nodata-content {
	width: 100%;
	text-align: center;
}

.nodata-box {
	width: 100%;
	text-align: center;
	line-height: .48rem;
	position: relative;
	top: -2.1rem;
}

.nodata {
	width: 1.63rem;
}

.nodata-box p:nth-child(2) {
	margin-top: .18rem;
	font-size: .36rem;
	color: #9a908d;
	letter-spacing: .02rem;
}

.nodata-box p:nth-child(3) {
	font-size: .25rem;
	color: #9a908d;
	letter-spacing: .02rem;
}


/*投票*/

.gift-lay {
	display: none;
	background: url(../img/buy.png)no-repeat;
	background-size: 100% 100%;
	width: 5.17rem;
	height: 7.11rem;
}

.vote-lay {
	display: none;
	background: url(../img/vote-bg.png)no-repeat;
	background-size: 100% 100%;
	width: 4.69rem;
	height: 7.08rem;
}

.lay-content {
	width: 4.46rem;
	height: 6.15rem;
	margin: 0 auto;
	font-size: 0.24rem;
}

.lay-bottom {
	/* background: #000; */
	opacity: 0;
	position: absolute;
	bottom: .1rem;
	display: block;
	width: 2.28rem;
	height: .84rem;
	border-radius: .15rem;
	border: none;
	outline: none;
	left: 1.23rem;
}


/*送礼物*/

.lay-gift {
	opacity: 0;
	position: absolute;
	width: 2.16rem;
	height: 0.84rem;
	bottom: .1rem;
	left: .12rem;
}

.lay-tier {
	background: black;
	opacity: .7;
	width: 2.8rem;
	height: 3rem;
	color: white;
	border-radius: .2rem;
}

.lay-img-hook {
	width: 1rem;
	height: 1rem;
	margin: 0 auto;
	padding-top: .5rem;
	display: block;
}

.tier-name {
	font-size: .24rem;
	display: block;
	margin-top: .3rem;
	text-align: center;
}
.lay-flower-img{
	width: .8rem;
	margin: 0 auto;
	padding-top: .5rem;
	display: block;
}
.lay-flower-pic{
	width: .8rem;
	margin: 0 auto;
	padding-top: .1rem;
	display: block;
}
.tier-num {
	font-size: .24rem;
	display: block;
	text-align: center;
}


/*购买礼物*/

.lay-success-vote,
.lay-success-buy,
.lay-success-gift {
	display: none;
}

.lay-buy {
	opacity: 0;
	width: 2.16rem;
	height: 0.84rem;
	position: absolute;
	right: .2rem;
	bottom: .1rem;
}

.layui-layer-hui .layui-layer-content {
	background: black;
	opacity: .4;
}

.lay-img {
	width: 2.09rem;
	margin: 0 auto;
	padding-top: .9rem;
}

.lay-img-vote {
	width: 2.09rem;
}

.lay-reminde {
	width: 100%;
	color: #863238;
	font-size: .24rem;
	letter-spacing: .02rem;
	padding-top: .3rem;
	display: block;
	text-align: center;
}

.lay-num-vote {
	margin-top: 0.67rem;
	font-size: 0.24rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

.lay-number {
	margin-left: .07rem;
	width: 1.58rem;
	height: .41rem;
	border: solid .01rem #7d7d7d;
	border-radius: .12rem;
	overflow: hidden;
}

.lay-num-vote span,
.lay-num-gift span {
	display: block;
	font-size: .24rem;
	color: #3b3a3a;
}

.lay-tip {
	color: #8a8886;
	transform: scale(.83);
	transform-origin: 50% 0;
	display: block;
	text-align: center;
	margin: 0 auto;
	margin-top: 0.17rem;
}

.reduce {
	border-radius: .12rem 0 0 .12rem;
	text-align: center;
	font-size: .24rem;
	float: left;
}

.add {
	border-radius: 0 .12rem .12rem 0;
	text-align: center;
	font-size: .24rem;
	float: left;
}

.number-box {
	width: ;
}

.reduce,
.add {
	width: 0.46rem;
	height: 100%;
	background: #c7c8bf;
	font-size: 0.24rem;
	color: #8c8a89;
	line-height: .41rem;
}

.lay-val {
	width: 0.66rem;
	height: 100%;
	outline: none;
	border: none;
	float: left;
	text-align: center;
	font-size: .24rem;
	background: #e2e3dd;
	color: #3a3a3a;
}


/*礼物弹窗*/

.lay-img-flower {
	width: 1.66rem;
}

.lay-img-box {
	width: 1.66rem;
	height: 3.10rem;
	padding-top: .61rem;
	display: block;
	margin: 0 auto;
}

.lay-reminde-flower {
	width: 90%;
	color: #863238;
	font-size: .24rem;
	padding-top: .3rem;
	display: block;
	margin: 0 auto;
	text-align: center;
}

.reduce-gift,
.add-gift {
	height: .39rem;
	background: #c7c8bf;
	font-size: 0.24rem;
	color: #8c8a89;
}

.reduce-gift {
	border-radius: .12rem 0 0 .12rem;
	text-align: center;
	font-size: .24rem;
	margin-left: .01rem;
	width: 0.45rem;
}

.add-gift {
	width: 0.45rem;
	border-radius: 0 .12rem .12rem 0;
	text-align: center;
	font-size: .24rem;
}

.lay-num-gift {
	margin-top: 0.38rem;
	display: flex;
	justify-content: center;
	align-items: center;
}


/*输入手机弹窗*/

.phone-lay {
	width: 5.27rem;
	height: 6.48rem;
	display: none;
	background: url(../img/phone.png)no-repeat;
	background-size: 100% 100%;
}

.phone-lay-box {
	width: 4.38rem;
	margin: 0 auto;
	font-size: .24rem;
	padding-top: 1.83rem;
}

.tel {
	width: 3.96rem;
	height: .74rem;
	background-color: #f0f1ed;
	border-radius: .15rem;
	border: solid .01rem #a6a4a4;
	line-height: .74rem;
	font-size: .24rem;
	padding-left: .42rem;
	outline: none;
}

.phone-lay-box input::-webkit-input-placeholder {
	color: #9c9a9a;
}

.verification-code {
	width: 4.36rem;
	height: .74rem;
	margin-top: .17rem;
	background-color: #f0f1ed;
	border-radius: .15rem;
	border: solid .01rem #a6a4a4;
	display: flex;
	align-items: center;
	overflow: hidden;
}

.verification-code input {
	width: 2.31rem;
	height: 100%;
	border: none;
	outline: none;
	border-radius: .15rem 0 0 .15rem;
	background-color: #f0f1ed;
	font-size: .24rem;
	padding-left: .42rem;
}

.verification-code input::-webkit-input-placeholder {
	color: #9c9a9a;
}

.verification-code span {
	display: block;
	width: 1.62rem;
	height: 100%;
	color: #302f2f;
	font-size: .24rem;
	text-align: center;
	line-height: .72rem;
	background-color: #d4cabb;
	border-radius: 0 .15rem .15rem 0;
}

.phone-lay-tip {
	color: #8a8886;
	width: 120%;
	font-size: .24rem;
	transform: scale(.83);
	transform-origin: 0 0;
	display: block;
	white-space: normal;
	text-align: center;
	margin-top: 0.37rem;
}